<!-- 提交结果页面 -->
<template>
	<view>
		<view class="rs-module">
			<view class="rs-top rs-flex">
				<text class="wkfont sc-icon">&#xe611;</text>
				<text class="sc-text">提交成功</text>
			</view>
			<view class="rs-item rs-flex">
				<text class="rs-lable">当前得分：</text>
				<text class="rs-value">
					<text class="rs-value-score">{{subInfo.current_score||'0'}}</text>
					<text class="rs-value-unit">分</text>
				</text>
			</view>
			<view class="rs-item rs-flex">
				<text class="rs-lable">习题总分：</text>
				<text class="rs-value">{{subInfo.total_score||'0'}}分</text>
			</view>
			<view class="rs-item rs-flex">
				<text class="rs-lable">题目总数：</text>
				<text class="rs-value">{{subInfo.total_count||'0'}}题</text>
			</view>
			<view class="rs-item rs-flex">
				<text class="rs-lable">答对题数：</text>
				<text class="rs-value">{{subInfo.correct_count||'0'}}题</text>
			</view>
			<view class="rs-item rs-flex">
				<text class="rs-lable">答错题数：</text>
				<text class="rs-value">
					<text style="color: #e03636;">{{subInfo.error_count||'0'}}</text>题
				</text>
			</view>
			<!-- 			<view class="rs-item rs-flex">
				<text class="rs-lable">答案解析：</text>
				<text class="rs-value link"
					@click="openAnswer">查看答案解析>></text>
			</view> -->
		</view>
	</view>
</template>
<script>
	/**
	 * 提交结果页面
	 */
	export default {
		data() {
			return {}
		},
		props: {
			subInfo: {
				type: Object,
				default () {
					return {}
				}
			}
		},
		methods: {
			openAnswer() {
				const {
					id: rowId
				} = this.subInfo
				uni.redirectTo({
					url: `/pages/exerc/analyze/index?subId=${rowId}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	$margin: 24upx;

	.rs-flex {
		display: flex;
	}

	.rs-module {
		margin: $margin;
		margin-top: 12upx;
		background-color: #ffffff;
		border-radius: 16upx;
		padding: 28upx 58upx;
		padding-bottom: 58upx;

		.rs-top {
			align-items: center;

			.sc-icon {
				color: #6bbb72;
				font-size: 88upx;
			}

			.sc-text {
				color: #343434;
				font-size: 36upx;
				font-weight: bold;
				padding: 0 28upx;
			}
		}

		.rs-item {
			align-items: center;

			.rs-lable {
				color: #636463;
			}

			.rs-value {
				padding: 0 24upx;
				line-height: 70upx;

				&-score {
					color: #e03636;
					font-size: 48upx;
				}

				&-unit {
					color: #343434;
					font-size: 32upx;
				}

				&.link {
					color: $maincolor;

					&:active {
						opacity: 0.8;
					}
				}
			}

		}
	}
</style>